<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>Vmall后台管理--商品添加</title>
		<link rel="stylesheet" href="css/gzh/admin.css" />
		<link rel="stylesheet" href="css/new.css" />
		<link rel="stylesheet" href="css/font-awesome.min.css" />
		<link rel="stylesheet" href="css/font-awesome.css" />
		<link rel="stylesheet" href="css/adminSystem.css" />
		<script src="lib/vue.js"></script>
		<script src="js/gzh/jquery-3.3.1.min.js"></script>
		<script src="lib/bootstrap.min.js"></script>
		<style type="text/css">
.wrapper{
	margin: auto;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto;
	/*IE6不识别min-height*/
	position: relative;
	overflow: hidden;
}
body{
	margin: auto;
}
.itemInfo>td{
	border-top: 1px solid #f4f4f4;
	    padding: 8px;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid #ddd;
    font-size:26;
}
td:nth-child(1){
	width:547px;
}
td:nth-child(2){
	width:548px;
}
td:nth-child(3){
	width:548px;
}
		</style>
	</head>

	<body class="fixed skin-blue">
		<div class="wrapper" style="height: auto; min-height: 100%;">
			<header class="main-header">
				<div class="logo">
					<span class="logo-lg"><b>VMALL</b>后台管理</span>
				</div>
				<nav class="navbar navbar-static-top">
					<a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button">
						<span class="sr-only glyphicon glyphicon-th-list"></span>
					</a>

					<!--顶部菜单 开始-->
					<div id="menu" class="navbar-custom-menu">
						<ul class="nav navbar-nav" name="topMenu">
							<li class="active">
								<a hidefocus="true" href="/goods/goods_list">商品</a>
							</li>
							<li>
								<a hidefocus="true" href="/member/member_list">会员</a>
							</li>
							<li>
								<a hidefocus="true" href="/order/order_list">订单</a>
							</li>
							<li>
								<a hidefocus="true" href="/market/pro_rule_list">营销</a>
							</li>
							<li>
								<a hidefocus="true" href="/market/user_reg">统计</a>
							</li>
							<li>
								<a hidefocus="true" href="/system/default">系统</a>
							</li>
							<li>
								<a hidefocus="true" href="/tools/db_bak">工具</a>
							</li>
							<li>
								<a hidefocus="true" href="/plugins/plugin_list">插件</a>
							</li>
							<li>
								<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
							</li>
						</ul>
					</div>
					<!--顶部菜单 结束-->
				</nav>
			</header>

			<aside id="admin_left" class="main-sidebar">
				<section class="sidebar" style="height: auto;">
					<div class="user-panel">
						<div class="pull-left image">

							<i class="glyphicon glyphicon-user"></i>
						</div>
						<div class="pull-left info">
							<p>admin</p>
							<a href="#">超级管理员</a>
						</div>
					</div>

					<ul class="sidebar-menu tree" data-widget="tree">
						<li class="header">商品模块菜单</li>
						<li class="treeview menu-open">
							<a href="#collapseOne" data-toggle="collapse" data-parent="#accordion">
								<i class="fa fa-home" name="ico" menu="商品管理"></i>
								<span>商品管理</span>
								<span class="pull-right-container">
									<i class="glyphicon glyphicon-chevron-down pull-right"></i>
								</span>
							</a>
							<ul id="collapseOne" class="treeview-menu" name="leftMenu" style="display: block;">
								<li >
									<a href="gzh-adminGoods.html"><i class="fa fa-circle-o"></i>商品列表</a>
								</li>
								<li class="active">
									<a href="#"><i class="fa fa-circle-o"></i>添加商品</a>
								</li>
							</ul>
						</li>
						<li class="treeview">
							<a href="#collapseTwo" data-toggle="collapse" data-parent="#accordion">
								<i class="fa fa-wrench" name="ico" menu="商品分类"></i>
								<span>商品分类</span>
								<span class="pull-right-container">
									<i class="glyphicon glyphicon-chevron-left pull-right"></i>
								</span>
							</a>
							<ul id="collapseTwo" class="treeview-menu" name="leftMenu">
								<li>
									<a href="/system/conf_base"><i class="fa fa-circle-o"></i>分类列表</a>
								</li>
								<li>
									<a href="/system/conf_guide"><i class="fa fa-circle-o"></i>添加分类</a>
								</li>
							</ul>
						</li>
						<li class="treeview">
							<a href="#collapseFour" data-toggle="collapse" data-parent="#accordion">
								<i class="fa fa-share-alt" name="ico" menu="搜索"></i>
								<span>搜索</span>
								<span class="pull-right-container">
									<i class="glyphicon glyphicon-chevron-left pull-right"></i>
								</span>
							</a>
							<ul id="collapseFour" class="treeview-menu" name="leftMenu">
								<li>
									<a href="/system/oauth_list"><i class="fa fa-circle-o"></i>关键字搜索</a>
								</li>
								<li>
									<a href="/system/hsms"><i class="fa fa-circle-o"></i>-----</a>
								</li>
							</ul>
						</li>
						<li class="treeview">
							<a href="#collapseFive" data-toggle="collapse" data-parent="#accordion">
								<i class="fa fa-truck" name="ico" menu="配送管理"></i>
								<span>配送管理</span>
								<span class="pull-right-container">
									<i class="glyphicon glyphicon-chevron-left pull-right"></i>
								</span>
							</a>
							<ul id="collapseFive" class="treeview-menu" name="leftMenu">
								<li>
									<a href="/system/delivery"><i class="fa fa-circle-o"></i>配送方式</a>
								</li>
								<li>
									<a href="/system/freight_list"><i class="fa fa-circle-o"></i>物流公司</a>
								</li>
								<li>
									<a href="/system/takeself_list"><i class="fa fa-circle-o"></i>自提点列表</a>
								</li>
								<li>
									<a href="/system/takeself_edit"><i class="fa fa-circle-o"></i>添加自提点</a>
								</li>
							</ul>
						</li>

					</ul>
				</section>
			</aside>
			<div id="admin_right" class="content-wrapper" style="min-height: 850px;">
				<div class="breadcrumbs" id="breadcrumbs">
					<ul class="breadcrumb">
						<li>
							<i class="home-icon fa fa-home"></i>
							<a href="#">商品</a>
						</li>
						<li>
							<a href="#">商品管理</a>
						</li>
						<li class="active">商品编辑</li>
					</ul>
				</div>
				<div class="content" style="min-height: 850px;">
					<div id="classify">
						<select id="first" onchange="getSecond(this.value)">
							<option value="0">请选择一级分类</option>
							<c:forEach items="${list1 }" var="first">
								<option value="${first.firstCategoryid}">${first.name}</option>
								<script>
								
								
								</script>
							</c:forEach>
						</select>
						<select id="second" onchange="getThird()">
					        <option value="0">请选择二级分类</option>
					    </select>
					</div>
				</div>
			</div>	
		</div>

		
		<script type="text/javascript">
			$(function() {
				$('#collapseone').collapse('show')
			});
			$(function() {
				$('#collapseTwo').collapse('hide')
			});
			$(function() {
				$('#collapseThree').collapse('hide')
			});
			$(function() {
				$('#collapseFour').collapse('hide')
			});
			$(function() {
				$('#collapseFive').collapse('hide')
			});
			$(function() {
				$('#collapseSix').collapse('hide')
			});
			$(function() {
				$('#collapseSeven').collapse('hide')
			});
			
			var xhs;
			//获取二级分类
			function getSecond(firstid){
				var firstid= $("#first option:selected").val();
				
				if(firstid>0){
					var url="adminGoodList?method=getSecond&&firstid="+firstid;
					 //创建XMLHttpRequest组件
					  xhs=new XMLHttpRequest();
					//设置回调函数,processReuqest方法
					  xhs.onreadystatechange=processReuqest;
					  xhs.open("post", url, true);
					  xhs.send(null);
				}
				
			}
			
			 //processReuqest方法作为回调方法
			 function processReuqest(){
				 if(xhs.readyState==4){
					 if(xhs.status==200){
						 var second=document.createElement("select");
						 second.id="second";
						 second.onchange=function test(){
							
						 }
						//为新创建的select节点添加option节点
						 var op=document.createElement("option");
						 op.value=0;
						 op.innerHTML="请选择二级分类";
						 second.appendChild(op);
						//得到完成请求后返回的字串符
						 var str = xhs.responseText;
						//根据返回的字符串为新创建的select节点添加option节点
						 var arr1=str.split(",");
						 for(var i=0;i<arr1.length;i++){
							var arr2=arr1[i].split("=");
							var child=document.createElement("option");
							 if(typeof(arr2[1])=="undefined"){
								arr2[1]="暂无";
							}
							child.innerHTML=arr2[1];
							child.value=arr2[0];
							second.appendChild(child);
							}
							//用新select节点替换旧的select节点
							var select = document.getElementById("second");
							var classify=document.getElementById("classify");
							classify.replaceChild(second,select);
					 }
				 }
			 }
			
			
			
		</script>

	</body>

</html>